<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>问诊</title>
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta content="telephone=no" name="format-detection">
    <link rel="stylesheet" href="./css/swiper.min.css">
    <link rel="stylesheet" href="./css/font-awesome.min.css">
    <link rel="stylesheet" href="css/ask.css">
    <script src="js/zepto.js"></script>
    <script src="./js/swiper.min.js"></script>
    <script src="js/main.js"></script>
    <script src="js/index.js"></script>
</head>

<body>
<div class="doc-home-page">
    <div class="doc-top">
        <div class="doc-top-t top-bar-l active">
            <a href="">看片</a>
        </div>
        <div class="doc-top-t top-bar-r">
            <a href="">问诊</a>
        </div>
    </div>
    <!-- Swiper -->
    <div class="doc-top-banner">
        <div class="swiper-container">
            <div class="swiper-wrapper">
                <div class="swiper-slide">
                    <a href="">
                        <img src="images/14.jpg" alt="">
                    </a>
                </div>
                <div class="swiper-slide">
                    <a href="">
                        <img src="images/15.jpg" alt="">
                    </a>
                </div>
                <div class="swiper-slide">
                    <a href="">
                        <img src="images/14.jpg" alt="">
                    </a>
                </div>
                <div class="swiper-slide">
                    <a href="">
                        <img src="images/15.jpg" alt="">
                    </a>
                </div>
            </div>
            <!-- 轮播图下方点点 -->
            <div class="swiper-pagination">
            </div>
        </div>
    </div>
    <div class="margin-box">
    </div>
    <div class="doc-register">
        <div class="cle-fl">
            <img src="images/circle1.png" alt="">
            <span>挂号</span>
        </div>
    </div>
    <div class="regis-list">
        <div class="regis-list-le">
            <a href="">
                <img src="images/2.png" alt="">
                <p class="re-fir">全部科室</p>
                <!--<p class="re-sec">阐述病症 </p>-->
                <!--<p class="re-thi">1分钟快速挂号</p>-->
            </a>
        </div>
        <div class="regis-list-ri">
            <ul>
                <li class="regis-list-li">
                    <a href="">
                        <img src="images/pifu.png" alt="">
                        <p>皮肤科</p>
                    </a>
                </li>
                <li class="regis-list-li">
                    <a href="">
                        <img src="images/erbihou.png" alt="">
                        <p>耳鼻喉科</p>
                    </a>
                </li>
                <li class="regis-list-li">
                    <a href="">
                        <img src="images/gu.png" alt="">
                        <p>骨科</p>
                    </a>
                </li>
                <li class="regis-list-li">
                    <a href="">
                        <img src="images/zhongyi.png" alt="">
                        <p>中医科</p>
                    </a>
                </li>
                <li class="regis-list-li">
                    <a href="">
                        <img src="images/kouqiang.png" alt="">
                        <p>口腔科</p>
                    </a>
                </li>
                <li class="regis-list-li">
                    <a href="">
                        <img src="images/meirong.png" alt="">
                        <p>美容整形</p>
                    </a>
                </li>
            </ul>
        </div>
    </div>
    <div class="margin-box-m">
    </div>
    <div class="doctor-list-top">
        热门医生
    </div>
    <!-- 医生列表滑动 -->
    <div class="doc-cen-banner">
        <div class="swiper-container">
            <div class="swiper-wrapper">
                <div class="swiper-slide">
                    <a href="">
                        <img src="./images/person.png" alt="">
                        <p class="doc-list-fir">刘大富</p>
                        <p class="doc-list-sec">主治骨科 </p>
                        <p class="doc-list-thi">治愈上千位</p>
                    </a>
                </div>
                <div class="swiper-slide">
                    <a href="">
                        <img src="./images/person.png" alt="">
                        <p class="doc-list-fir">刘大富</p>
                        <p class="doc-list-sec">主治骨科</p>
                        <p class="doc-list-thi">治愈上千位</p>
                    </a>
                </div>
                <div class="swiper-slide">
                    <a href="">
                        <img src="./images/person.png" alt="">
                        <p class="doc-list-fir">刘大富</p>
                        <p class="doc-list-sec">主治骨科</p>
                        <p class="doc-list-thi">治愈上千位患</p>
                    </a>
                </div>
                <div class="swiper-slide">
                    <a href="">
                        <img src="./images/person.png" alt="">
                        <p class="doc-list-fir">刘大富</p>
                        <p class="doc-list-sec">主治骨科</p>
                        <p class="doc-list-thi">治愈上千位</p>
                    </a>
                </div>
                <div class="swiper-slide">
                    <a href="">
                        <img src="./images/person.png" alt="">
                        <p class="doc-list-fir">刘大富</p>
                        <p class="doc-list-sec">主治骨科</p>
                        <p class="doc-list-thi">治愈上千位</p>
                    </a>
                </div>
                <div class="swiper-slide">
                    <a href="">
                        <img src="./images/person.png" alt="">
                        <p class="doc-list-fir">刘大富</p>
                        <p class="doc-list-sec">主治骨科</p>
                        <p class="doc-list-thi">治愈上千位</p>
                    </a>
                </div>
            </div>
        </div>
    </div>
    <div class="margin-box">
    </div>
    <!-- 询问区域 -->
    <div class="ask_container">
        <div class='interrogation'>
            <div class="interrogation-title ">
                <div class="interrogation-left ">
                    <img src="images/icon/circle2.png">
                    <span>问诊</span>
                </div>
                <ul class=" clearfix f_r">
                    <li class="f_l">
                        <a href="#">
                            <img src="images/icon/ask.png" alt="">
                        </a>
                    </li>
                    <li class="f_l">
                        <a href="#">
                            <img src="images/icon/find.png" alt="">
                        </a>
                    </li>
                </ul>
            </div>
            <div class="interrogation-centent">
                <div class="interrogation-container">
                    <div class="centent-top">
                        <div class="keshi f_l">
                            耳鼻喉头颈科
                        </div>
                        <div class="time f_r">
                            2017-05-02
                        </div>
                    </div>
                    <div class="centent-description">
                        <p>我额诶非法核算的花果山伺服机所所所搜多女多女搜集偶剧哦VC美女覅你回复才能恢复是</p>
                        <span></span>
                    </div>
                    <div class="centent-status">
                        等待医生回复
                    </div>
                </div>
            </div>
            <div class="interrogation-centent">
                <div class="interrogation-container">
                    <div class="centent-top">
                        <div class="keshi f_l">
                            耳鼻喉头颈科
                        </div>
                        <div class="time f_r">
                            2017-05-02
                        </div>
                    </div>
                    <div class="centent-description clearfix hasimg">
                        <img src="images/hasi.png" class="hasimg-icon">
                        <p>我额诶非法核算的花果山伺服机所所所搜多女多女搜集偶剧哦VC美女覅你回复才能</p>
                        <span></span>
                    </div>
                    <div class="centent-status offer">
                        <img src="images/person.png" class="head-img">
                        <span>陈潜</span>医生,已回复
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!--定位浮标-->
<div class="introduce-footer clearfix">
    <div class="footer-top">
        <a href="#" class="footer-left f_l ask"> <img src="images/icon/ask%20button.png" alt=""><span>免费问诊</span></a>
        <a href="#" class="footer-righter f_r order"><img src="images/icon/book%20button.png"
                                                          alt=""><span>预约挂号</span></a>
    </div>
    <div class="tab-bar">
        <ul class="clearfix">
            <li class="tab-group  f_l  "><a href="#">

                <span>会诊室</span></a></li>
            <li class="tab-home f_l home-currunt"><a href="#">
                <span>首页</span></a></li>
            <li class="tab-personal f_l"><a href="#">
                <span>我</span></a></li>
        </ul>
    </div>


</div>
<!-- Swiper JS -->
<script>
    var swiper_top = new Swiper('.doc-top-banner .swiper-container', {
        pagination: '.doc-top-banner .swiper-pagination',
        slidesPerView: 1,
        paginationClickable: true,
        loop: true,
        autoplay: 1500,
        autoplayDisableOnInteraction: false
    });

    var swiper_doc = new Swiper('.doc-cen-banner .swiper-container', {
        slidesPerView: 3.5,
        paginationClickable: true,
        spaceBetween: 0,
        freeMode: true
    });


</script>

</body>

</html>